import React from 'react';

export default class Item extends React.Component {
  constructor(props) {
    super(props)
    this.state = {
      value: this.props.initialValue
    }
  }
  render () {
    let { label, name, children, onChange } = this.props;
    return (
      <div className="sb-item">
        <div className className="sb-item-label">{label}</div>
        <div className="sb-item-input-wrapper">
          {
            React.cloneElement(children, {
              value: this.state.value,
              onChange: (e) => {
                // TODO 我想拿到外层form组件实例 实在是不会react 我也很绝望，也感觉这属性不靠谱
                this.setState({
                  value: e.target.value
                })
                onChange(name, e.target.value)
              }
            })
          }
        </div>
      </div>
    )
  }
}